		<!-- Begin of titlebar/breadcrumbs -->
		<div id="title-bar">
			<ul id="breadcrumbs">
				<li><a href="dashboard.html" title="Home"><span id="bc-home"></span></a></li>
				<li class="no-hover">Statistics</li>
			</ul>
		</div> <!--! end of #title-bar -->
		
		<div class="shadow-bottom shadow-titlebar"></div>
		
		<!-- Begin of #main-content -->
		<div id="main-content">
			<div class="container_12">
			
			<div class="grid_12">
				<h1>Statistics</h1>
				<p>Social Network Statistics</p>
			</div>
			
			<div class="grid_12">
				<div class="block-border" id="tab-graph">
					<div class="block-header">
						<h1>Graph</h1>
						<ul class="tabs">
							<li><a href="#tab-line">Line</a></li>
							<li><a href="#tab-area">Area</a></li>
							<li><a href="#tab-pie">Pie</a></li>
							<li><a href="#tab-bar">Bar</a></li>
						</ul>
					</div>
					<div class="block-content tab-container">
						<table id="graph-data" class="graph">
								<caption>2013 Like Statisc</caption>
								<thead>
									<tr>
										<td></td>
										<th scope="col">Event Announcement</th>
										<th scope="col">auto</th>
										<th scope="col">household</th>
										<th scope="col">furniture</th>
										<th scope="col">kitchen</th>
										<th scope="col">bath</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<th scope="row">Mary</th>
										<td>190</td>
										<td>160</td>
										<td>40</td>
										<td>120</td>
										<td>30</td>
										<td>70</td>
									</tr>
									<tr>
										<th scope="row">Tom</th>
										<td>3</td>
										<td>40</td>
										<td>30</td>
										<td>45</td>
										<td>35</td>
										<td>49</td>
									</tr>
									<tr>
										<th scope="row">Brad</th>
										<td>10</td>
										<td>180</td>
										<td>10</td>
										<td>85</td>
										<td>25</td>
										<td>79</td>
									</tr>
									<tr>
										<th scope="row">Kate</th>
										<td>40</td>
										<td>80</td>
										<td>90</td>
										<td>25</td>
										<td>15</td>
										<td>119</td>
									</tr>		
								</tbody>
							</table>
							
						<div id="tab-line" class="tab-content"></div>
						<div id="tab-area" class="tab-content"></div>
						<div id="tab-pie" class="tab-content"></div>
						<div id="tab-bar" class="tab-content"></div>
						

					</div>
				</div>
			</div>
			
			<div class="clear height-fix"></div>

		</div></div> <!--! end of #main-content -->
 <script type="text/javascript">
	   $().ready(function() {	
	   /*
		 * Charts
		 */
		$('#graph-data').visualize({type: 'line', height: 250}).appendTo('#tab-line').trigger('visualizeRefresh');
		$('#graph-data').visualize({type: 'area', height: 250}).appendTo('#tab-area').trigger('visualizeRefresh');
		$('#graph-data').visualize({type: 'pie', height: 250}).appendTo('#tab-pie').trigger('visualizeRefresh');
		$('#graph-data').visualize({type: 'bar', height: 250}).appendTo('#tab-bar').trigger('visualizeRefresh');
		
		/*
		 * Tabs
		 */
		$("#specify-a-unique-tab-name").createTabs();
		$("#tab-graph").createTabs();
		
	   });
 </script>